<template>
	<view>
		<tab @switchStatus="switchStatus"/>
		<!-- list -->
		<block v-if="isHasDataFlag">
			<order-list 
				:orderList="orderList"
				:loading="loading" 
				@goPay="goPay"
				@goOrderDet="goOrderDet"
				@cancelOrder="cancelOrder"
			></order-list>
		</block>
		<block v-else-if="isHasDataFlag == false">
			<no-data></no-data>
		</block>
		<common-alert :showAlertFlag="showAlertFlag" :alertWidth="alertWidth">
			<view class="alertContent">是否确认取消该订单?</view>
			<view class="tui-alert-btn" :hover-stay-time="150">
				<view class="cancelBtn" @tap.stop="cancelDel">取消</view>
				<view class="sureBtn" @tap="sureFun">确认</view>
			</view>
		</common-alert>
	</view>
</template>

<script>
	import Tab from './components/Tab'
	import OrderList from './components/OrderList'
	import { getGsOrderList } from '@/api/group/index'
	import { cancelOrder } from '@/api/xlzx/index';
	export default {
		components:{
			Tab,
			OrderList
		},
		data(){
			return{
				statusNum:0,
				nowPage:1,
				loading:false,
				isHasDataFlag:null,
				orderList:[],
				isRefreshFlag:false,
				showAlertFlag:false,
				alertWidth:600,
				currOrderId:'',
				payStatus:-1
			}
		},
		onLoad(){
			this.loadGsOrderList();
		},
		onShow(){
			if(this.isRefreshFlag){
				this.initParams();
			}
		},
		onHide(){
			this.isRefreshFlag = false;
		},
		onPullDownRefresh : function(){
			this.initParams();
			uni.stopPullDownRefresh();
		},
		onReachBottom : function(){
			if( !this.loading ){
				this.loadGsOrderList();
			}
		},
		methods:{
			cancelOrder(orderId){
				this.showAlertFlag = true;
				this.currOrderId = orderId;
			},
			cancelDel(){
				this.showAlertFlag = false;
			},
			sureFun(){
				var field = {id:this.currOrderId};
				uni.showLoading({ title: '取消中...', mask: true });
				cancelOrder(field).then(res=>{
					this.util.showToastSuc('取消成功');
					setTimeout(()=>{
						this.currOrderId = '';
						this.initParams();
						this.showAlertFlag = false;
					},1500);
				}).catch(err=>{console.log(err)});
			},
			//去支付
			goPay(orderId,actMoney){
				if(actMoney == 0){
					this.util.showToast('等待机构确认价格中...');
					return;
				}
				uni.navigateTo({
					url:'../../subIndex/orderPay/orderPay?orderId=' + orderId + '&fromPage=groupOrder'
				})
			},
			loadGsOrderList(){
				let { nowPage,orderList } = this;
				this.loading = true;
				var field = { payStatus:this.payStatus,page:this.nowPage,limit:this.limit };
				getGsOrderList(field).then(res=>{
					//console.log(res) 
					nowPage += 1;
					orderList.push( ...res.data.datas );
					this.orderList = orderList;
					this.nowPage = nowPage;
					this.loading = false;
					this.isHasDataFlag = true;
				}).catch(err=>{
					//console.log(err)
					this.loading = false;
					this.isHasDataFlag=false;
				});
			},
			initParams(){
				this.nowPage = 1;
				this.loading = false;
				this.orderList = [];
				this.loadGsOrderList();
			},
			switchStatus(payStatus){
				this.payStatus = payStatus;
				this.initParams();
			},
			goOrderDet(orderId){
				uni.navigateTo({
					url:'../groupOrderDet/groupOrderDet?orderId=' + orderId
				})
			},
		}
	}
</script>

<style lang='scss'>
	@import url("/static/css/common/alert.css");
	page{
		background: $pss-bg-primary;
		margin-top: 110rpx;
	}
</style>